import React from 'react'

export default class setStateDemo extends React.Component{
    constructor(props){
        super(props)
        this.state={
            count:1
        }
    }

    async changeState(){
        // this.setState({
        //     // count:this.state.count+1
        //     //上面一行和下面一行有什么不一样？这不是废话嘛。。。
        //     // 下面这一行，this.state.count+=1这是一行代码。执行为this.state.count=this.state.count+1，并且其返回值是加过之后的值
        //     // 并且执行到log的时候this.state.count实际上已经发生改变了
        //     // 而this.state.count+1的时候this.state.count的值并没有发生改变
        //     count:this.state.count+=1
        // },()=>{
        //     console.log(this.state.count);
        // })
        await this.changeStates({
            count:this.state.count+1
        })
        console.log(this.state.count); 
    }

    changeStates(state){
        return new Promise((resolve)=>{
            setTimeout(()=>{
                this.setState(state,resolve)
            }) 
        })
    }

    render(){
        return (
            <div>
                <div>这是setStateDemo组件</div> 
                <p>这是state的值{this.state.count}</p>
                <button onClick={this.changeState.bind(this)}>这是一个按钮</button>
            </div>

        )
    }
}